<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>网页综合应用</title>
        <style type="text/css">
            ul{/*设置导航栏的框框*/
		 	margin: 5px auto;/*框框整体的位置，30px是指离网页的顶部和下部的距离，auto控制的是左右距离为自动调节*/
			/* width: 600px;框框的宽度 */
			/* height: 350px;框框的长度 */
			padding: 0px;/*将框框的padding设置为零，不然会导致框框里的内容与框边缘有间隔*/
			/* border:1px solid #000;添加边框 */
		}
		li.daohang{
			list-style-type: none;/* 去掉li前的点 */
			float: left;/*将li设置成做浮动，变为联动*/
		}
		a.first{
			display: block;/*将a变成块状*/
			width: 100px;/*设置块的宽度*/
			height: 50px;/*设置块的长度*/
			font-family: Microsoft Yahei;
			line-height: 50px;/*设置字体在块中的高度*/
			background-color: #b7e1e5;
			margin: 0px 0px;/*块里的高宽通过margin设置*/
			color: rgb(50, 2, 2);
			text-align: center;/*字体居中*/
			text-decoration: none;/*去掉下划线*/
			font-size: 15px;
		}
		/* a:hover{
			background-color: #3f4d46;
		} */
            div{
                /* border:1px solid black; */
                background-color: white;
            }
            div.head{
                margin:0px auto;
                width:100%;
                height:500px;
                /* border:solid brown 2px; */
            }
            div.body{
                width:70%;
                margin:0px auto;
                /* height:1000px; */
            }
            div.container{
                width:100%;
                height:500px;
                /* border-color:red; */
                /* border:2px solid black; */
            }
            .footer{
                width:100%;
                height:120px;
                
            }
            .gonggao{
                border-style: solid;
                border-width: 2px;
                border-color:#55c8e5;
                height:28%;
                margin-top: 5px;
                margin-bottom: 10px;
                margin-left:15px;
                margin-right:10px;
            }
            .gonggao_title{
                width:100%;
                /* border:solid #55c8e5 2px; */
                background-color: #55c8e5;
                font-size: large;
                color:white;
                font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
            }
            .gonggao_line{
                margin:0px auto;
                margin-top:10%;
                border-style:dashed;
                border-top:0;
                border-left:0;
                border-right:0;
                border-color:antiquewhite;
                width:80%;
                height:20px;
            }
            span.news{
                color:burlywood;
                font-size:large;
                font-family:'Times New Roman', Times, serif;
            }
            span.notice{
                color:#b7e1e5;
                font-size:large;
                font-family:'Times New Roman', Times, serif;
            }
            span.chi{
                color:#b7e1e5;
                font-size:small;
                font-family:'Times New Roman', Times, serif;
            }
        </style>
    </head>
    <body style="background-color: #55c8e5;">
        <div class="body">
            <div class="head">
                <img src="20220919163657.png" style="width:110px;height:60px;margin-left:5px;">
                <div style="float:right;">
		            <ul>
			            <li class="daohang"><a href="" class="first">关于</a></li>
			            <li class="daohang"><a href="" class="first">设置首页</a></li>
			            <li class="daohang"><a href="" class="first">联系我们</a></li>
			            <li class="daohang"><a href="" class="first">收藏本站</a></li>
		            </ul>
                </div>
                <div style="width:100%">
                    <img src="20220919182844.png" style="width:100%">
                </div>
                <div style="float:left;width:100%;">
                    <ul>
			            <li class="daohang"><a href="" class="first">关于</a></li>
			            <li class="daohang"><a href="" class="first">设置首页</a></li>
			            <li class="daohang"><a href="" class="first">联系我们</a></li>
			            <li class="daohang"><a href="" class="first">收藏本站</a></li>
		            </ul>
                </div>
            </div>
            <div class="container">
                <div style="float:left;width:39%;height:100%;">
                    <div class="gonggao">
                        <div class="gonggao_title">&nbsp&nbsp网站公告</div>
                        <div class="gonggao_line">&nbsp&nbsp公告标题</div>
                    </div>
                    <div class="gonggao">
                        <div class="gonggao_title">&nbsp&nbsp软件下载排行</div>
                        <div class="gonggao_line">&nbsp&nbsp企业EQ</div>
                    </div>
                    <div class="gonggao">
                        <div class="gonggao_title">&nbsp&nbsp友情链接</div>
                        <div class="gonggao_line">&nbsp&nbsp吉林省明日科技有限公司</div>
                    </div>
                </div>
                <div style="float:left;width:59%;height:100%;">
                    <div style="height:50%;">
                        <div style="height:40px;border-style:dashed;border-top:0;border-left:0;border-right:0;border-color:antiquewhite;">
                            <span class="news">&nbsp&nbspNEWS&nbsp</span>
                            <span class="notice">NOTICE</span>
                            <span class="chi">新闻热点</span>
                        </div>
                        <div style="height:205px;">
                            <div style="height:100%;width:35%;float:left;">
                                <img src="people.png" style="margin-left:20px; margin-top:10px;">
                            </div>
                            <div style="height:100%;">
                                <li style="margin:auto;">明日科技编程词典即将面世。</li>
                            </div>
                        </div>
                    </div>
                    <div style="height:50%;">
                        <div style="height:40px;border-style:dashed;border-top:0;border-left:0;border-right:0;border-color:antiquewhite;">
                            <span class="news">&nbsp&nbspINTRODUCE&nbsp</span>
                            <!-- <span class="notice">NOTICE</span> -->
                            <span class="chi">产品介绍</span>
                        </div>
                        <div style="height:205px;">
                            <div style="height:100%;width:55%;float:left;margin-left:10px;">
                                <table sytle="">
                                    <tr>
                                        <td>软件名称：</td>
                                        <td>企业EQ</td>
                                    </tr>
                                    <tr>
                                        <td>版本号：</td>
                                        <td>3.2</td>
                                    </tr>
                                    <tr>
                                        <td>运行平台：</td>
                                        <td>windows/Linux</td>
                                    </tr>
                                    <tr>
                                        <td>价格：</td>
                                        <td>1200.0</td>
                                    </tr>
                                    <tr>
                                        <td>软件类别：</td>
                                        <td>Java</td>
                                    </tr>
                                    <tr>
                                        <td>产品介绍：</td>
                                        <td>方便员工间的沟通！</td>
                                    </tr>
                                </table>
                            </div>
                            <div style="height:100%;">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="footer">
                <p align="center">锐芒科技客户服务热线：0431-84978981，84978982&nbsp传真：0431-84972266</p>
                <p align="center">CopyRight&nbsp&copy2012&nbspwww.xiumei.com&nbsp青海省修梅科技有限公司</p>
                <p align="center">本站请使用chrominum&nbsp1920*1080为最佳显示效果</p>
            </div>
        </div>
    </body>
</html>